<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>素材列表</title>
<script type="text/javascript" th:src="@{/js/material/material_manage.js}"></script>

<style>
  .form .form-left {
    width:100%; padding-left:10rem; padding-right:1rem; padding-top:1rem;
  }
  .form .form-right {
    width:100%; padding-left:1rem; padding-right:20rem; padding-top:1rem;
  }
 </style>
</head>
<body>
<div id="pageDiv">
	 	<div>
	    	<el-breadcrumb separator-class="el-icon-arrow-right">
			  <el-breadcrumb-item>素材管理</el-breadcrumb-item>
			  <el-breadcrumb-item>素材管理</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<br/>
		<el-button  type="primary" plain id="user_controller_btn" style="display:none;">
			   other
		</el-button>
		
		<div>
			<template>
			
  			 <el-form ref="searchpolling"  label-suffix="" label-width="90px" label-position="left" >
			    <div class="form">
			    <div class="form-right">
			    <el-row :gutter="20">
			    <el-col :span="6">
			       <el-form-item label="素材名称" >
			         <el-input placeholder="请输入素材名称" v-model="searchpolling.name"></el-input>
			       </el-form-item>
			       </el-col>
			       <el-col :span="6">
			       <el-form-item label="素材类型"  >
			         <el-input placeholder="请输入素材类型" v-model="searchpolling.type"></el-input> 
			       </el-form-item>
			       </el-col :span="6">
			       
			       <el-button  @click="toSearch()">查 &nbsp;&nbsp;&nbsp;&nbsp;询</el-button>
			       </el-col>
			       </el-row>
			     </div>
			    </div>
		  	</el-form>
  				
				
				
				<!-- 表格 -->
				<el-table  v-loading="loading" :data="tableData" height="460"  style="width: 100%">
					<el-table-column prop="name" label="素材名称  /文件名" width="200"></el-table-column>
					<el-table-column prop="creatorTypeDesc" label="素材类型" width="150"></el-table-column>
				    <el-table-column prop="memo" label="素材备注说明" width="350"></el-table-column>
				    <!-- <el-table-column prop="url" label="保存地址" width="200"></el-table-column> -->
				    <el-table-column prop="createTime" label="保存时间" :formatter="dateFormat" width="200"></el-table-column>
				    
				    <el-table-column label="编辑配置详情">
				      <template slot-scope="scope">
				      
				      
				      <!-- 弹窗 --> 
						<el-popover  ref="popover4" placement="left" width="600" trigger="click" class="demo-input-suffix">
						 <el-form :inline="false" :model="userConfigUpdate" ref="userConfigUpdate" label-position="right" size="small" :rules="rules">
							<el-form-item label="素材类型" prop="userName">
								<el-col :span="15">
		  							<!-- <el-input placeholder="请输入素材类型" v-model="scope.row.creatorTypeDesc"></el-input> -->
		  						 <el-select id = "selectType" v-model="scope.row.creatorType" value-key="scope.row.creatorType" @change="choose(scope.row)"  filterable placeholder="请选择">
								    <el-option
								      v-for="item in items"
								      :key="item.id"
								      :label="item.name"
								      :value="item.id">
								    </el-option>
								  </el-select>
								  </el-col>
		  						
		  						
							</el-form-item>
							<el-form-item label="素材名称" prop="name">
								<el-col :span="15">
		  							<el-input placeholder="请输入素材名称" v-model="scope.row.name"></el-input>
		  						</el-col>
							</el-form-item>
							<el-form-item label="素材备注说明" prop="memo">
								<el-col :span="15">
			  						<el-input placeholder="请输入素材备注说明" v-model="scope.row.memo"></el-input>
			  					</el-col>
							</el-form-item>
							
		  				</el-form>
		  				<span class="dialog-footer">
							    <el-button size="mini" type="primary" @click="updateForm('userConfigUpdate',scope.row)">确定</el-button>
							    <el-button size="mini" type="primary" @click="closePopper()">取消</el-button>
							</span>
						</el-popover>
			           <el-button  type="primary" size="mini" plain v-popover:popover4 @click="fullForm(scope.row)">
			          		修改
			           </el-button>
				       <el-button size="mini" plain type="danger" @click.native.prevent="deleteConfig(scope.$index, scope.row,tableData)"> 删除</el-button> 
				      </template>
				    </el-table-column>
				</el-table>
				<!-- 分页 -->
		    	<el-pagination 
		    		background
		    		@size-change="handleSizeChange" 
		    		@current-change="handleCurrentChange" 
		    		:current-page="currentPage" 
		    		:page-sizes="[3,5,10]" 
		    		:page-size="pagesize" layout="total, sizes, prev, pager, next, jumper" 
		    		:total="totalSize">
    			</el-pagination>
			</template>
		</div>
	</div>
</body>
</html>